<!-- 入账按钮 -->
<template>
  <el-dialog :title="title" :visible.sync="visible" width="800px" @close="resetForm">
    <el-form ref="form" :model="formData" :rules="rules" label-width="100px">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="交易号" prop="poolTransactionNum">
            <el-input v-model="formData.poolTransactionNum" placeholder="请输入交易号" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="交易时间" prop="poolTransactionDate">
            <el-date-picker
              v-model="formData.poolTransactionDate"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="请选择交易时间"
              style="width: 100%"
            />
          </el-form-item>
        </el-col>
      </el-row>
      
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="交易方信息" prop="poolCounterparty">
            <el-input v-model="formData.poolCounterparty" placeholder="请输入交易方信息" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="交易方账号" prop="poolAccount">
            <el-input v-model="formData.poolAccount" placeholder="请输入交易方账号" />
          </el-form-item>
        </el-col>
      </el-row>
      
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="交易银行" prop="poolBank">
            <el-input v-model="formData.poolBank" placeholder="请输入交易银行" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="入账金额" prop="poolInAmount">
            <el-input v-model.number="formData.poolInAmount" placeholder="请输入入账金额" />
          </el-form-item>
        </el-col>
      </el-row>
      
      <el-form-item label="备注信息" prop="poolRemark">
        <el-input
          v-model="formData.poolRemark"
          type="textarea"
          :rows="4"
          placeholder="请输入备注信息"
        />
      </el-form-item>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button @click="$emit('update:visible', false)">取 消</el-button>
      <el-button type="primary" @click="submitForm">入 账</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: "DepositDialog",
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: "入账"
    },
    formData: {
      type: Object,
      default: () => ({
        // fundPoolId:null,
      })
    }
  },
  data() {
    return {
      rules: {
        poolTransactionNum: [{ required: true, message: "请输入交易号", trigger: "blur" }],
        poolTransactionDate: [{ required: true, message: "请选择交易时间", trigger: "change" }],
        poolCounterparty: [{ required: true, message: "请输入交易方信息", trigger: "blur" }],
        poolAccount: [{ required: true, message: "请输入交易方账号", trigger: "blur" }],
        poolBank: [{ required: true, message: "请输入交易银行", trigger: "blur" }],
        poolInAmount: [
          { required: true, message: "请输入入账金额", trigger: "blur" },
          // { type: "number", message: "请输入有效数字", trigger: "blur" }
        ],
        poolRemark: [{ required: false, message: "请输入备注信息", trigger: "blur" }]
      }
    };
  },
  methods: {
    resetForm() {
      this.$refs["form"].resetFields();
    },
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.$emit("submit", this.formData);
          this.$emit("update:visible", false);
        }
      });
    }
  }
};
</script>